
<div class="portlet light bordered" style="margin: 15px;">
    <div class="portlet-title">
        <div class="caption">
            <span class="caption-subject bold"> Task: {{currentTask.id}}  </span>
        </div>
    </div>
    <div class="portlet-body form form-horizontal">
        <div class="form-group">
            <div class="col-md-3"><b>Priority</b>: {{currentTask.priority}}</div>
            <div class="col-md-3"><b>Status</b>: {{currentTask.status}}</div>
            <div class="col-md-3"><b>Task Way</b>: {{currentTask.taskWay}}</div>
        </div>
        <div class="form-group">
            <div class="col-md-3"><b>LP Configuration Template</b>: {{currentTask.lpTemplete.description}}</div>
            <div class="col-md-3"><b>Assignee</b>: {{currentTask.assignee.firstName}} {{currentTask.assignee.lastName}}</div>
            <div class="col-md-3"><b>Planned Assignee</b>: {{currentTask.plannedAssignee.firstName}} {{currentTask.plannedAssignee.lastName}}</div>
        </div>
        <div class="form-group">
            <div class="col-md-3"><b>Package Type</b>: {{currentTask.packagingTypeSpecName}}</div>
            <div class="col-md-6"><b>Package Type Product</b>:
                <span ng-repeat="property in currentTask.packagingTypeProduct.diverseProperties">
                     {{property.name}}: {{property.value}} {{property.unit}}&nbsp;
                </span>
            </div>
        </div>
        <div class="form-group">
            <div class="col-md-3"><b>Start Time</b>:{{currentTask.startTime | amDateFormat:'YYYY-MM-DD HH:mm:ss'}}</div>
            <div class="col-md-3"><b>End Time</b>: {{currentTask.endTime | amDateFormat:'YYYY-MM-DD HH:mm:ss'}}</div>
            <div class="col-md-3"><b>Date Created</b>: {{currentTask.createdWhen | amDateFormat:'YYYY-MM-DD HH:mm:ss'}}<span ng-show="task.createdBy">({{currentTask.createdBy}})</span></div>
            <div class="col-md-3"><b>Date Updated</b>: {{currentTask.updatedWhen | amDateFormat:'YYYY-MM-DD HH:mm:ss'}}<span ng-show="task.updatedBy">({{currentTask.updatedBy}})</span></div>
        </div>
        <div class="table-scrollable">
            <table class="table table-striped table-hover">
                <tr style="background: rgb(176, 193, 216);">
                    <th> Item </th>
                    <th> Unit </th>
                    <th> QTY </th>
                    <th> Remain QTY </th>
                </tr>
                <tr>
                    <td>{{currentTask.itemSpecName}}</td>
                    <td>{{currentTask.unitName}}</td>
                    <td>{{currentTask.itemCount}}</td>
                    <td>{{currentTask.remain_qty}}</td>
                </tr>
            </table>
        </div>
        <div style="margin: 50px 0px 10px;">
            <span style="font-weight: 600; font-size: 15px; line-height: 34px;">Separate Tasks</span>
            <button type="button" class="btn default" ng-click="addSeparateTask()"
                    style="background-color:rgb(176, 193, 216);
                    border-color: rgb(176, 193, 216);
                    float:right;">add Separate Task</button>
            <div class="clear:both;"></div>
        </div>

        <div ng-show="showWarnning" class="custom-alerts alert alert-danger fade in">
            <i class="fa-lg fa fa-warning"></i>Please add separate task!
        </div>

        <!--<h5 ng-show="separateTaskWarnings[separateTaskIndex]" style="color:red;text-align: right;font-weight: 500;">-->
            <!--Please add separate task!</h5>-->
        <form name="editForm" ng-submit="editForm.$valid && saveSeparateTasks()">
            <div class="portlet light bordered" ng-repeat="separateTask in separateTasks"  ng-init="separateTaskIndex = $index"
                 style="border:2px solid rgba(194, 202, 214, 0.7) !important; padding-top:20px; padding-bottom:10px;">
                <div class="row form-group">
                    <div class="col-md-9">
                        <div class="col-md-4">
                            <label style="float:left; padding-top: 8px; padding-right: 5px;">QTY:</label>
                            <input-validation-message field="qty{{separateTaskIndex}}"></input-validation-message>
                            <input type="number" name="qty{{separateTaskIndex}}" ng-model="separateTask.itemSpecQty"
                                   class="form-control" style="width:150px;"
                                   ng-change="updateRemainQtyAndCheckIsValidQty()"
                                   ng-class="{ 'pick-task-location-qty-full': qtyIsNotEffect[separateTaskIndex]}"/>
                        </div>
                    </div>
                    <div class="col-md-3" style="text-align: right; font-size: 15px;">
                        <a href="javascript:;" class="btn btn-circle btn-outline dark" ng-click="deleteSeparateTask(separateTaskIndex)">
                            <i class="fa icon-trash"></i> Delete </a>
                    </div>
                </div>
            </div>

            <div class="form-group form-actions right">
                <waitting-btn type="submit" btn-class="btn blue"
                              value="'Save'" is-loading="loading"></waitting-btn>
                <button type="button" class="btn default" ng-click="cancel(editForm)">Cancel</button>
            </div>
        </form>
    </div>
</div>




